<template>
	<view class="data_card" @click="goDetail">
		<view class="u-flex  u-flex-items-center u-m-b-24">
			<format :format="data.format"></format>
			<view class="f-s-16 u-m-l-20 f-w-b u-line-1">{{ data.title }}</view>
		</view>
		<view class="u-flex u-flex-between u-flex-items-center u-m-b-24">
			<tag :text="data.field?.name" />
			<Price :price="data.price" />
		</view>
		<view class="u-flex u-flex-between u-flex-items-center">
			<teacher-icon-text :name="data.teacher?.name" />
			<view class="sub-title">{{ data.size }}&nbsp;&nbsp;|&nbsp;&nbsp;{{ data.download }}次下载</view>
		</view>
	</view>
</template>
<script setup>
	import Tag from '@/components/common/tag.vue'
	import Price from '@/components/common/price.vue'
	import Format from '@/components/common/format.vue'
	import teacherIconText from "@/components/common/teacher-icon-text.vue"
	import {
		defineProps
	} from 'vue';
	const props = defineProps({
		data: Object
	})
	function goDetail() {
		uni.navigateTo({
			url: '/subPackages/data/index?id=' + props.data.id
		})
	}
</script>

<style lang="scss">
	.data_card {
		flex: 1;
		background-color: #fff;
		margin-bottom: 12px;
		border-radius: 8px;
		padding: 12px;
		box-shadow: 0 2px 4px #0000000a;
	}
</style>